import 'package:calendar_girl/views/play/widgets/Album.dart';
import 'package:calendar_girl/views/play/widgets/Lyrics.dart';
import 'package:calendar_girl/views/play/widgets/PlayPanel.dart';
import 'package:flutter/material.dart';
import 'package:calendar_girl/views/play/model/MusicModel.dart';

class Music extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return MusicState();
  }
}

class MusicState extends State<Music> with SingleTickerProviderStateMixin{
  bool _isAlbumShow = true;// 当前是否显示唱片
  MusicModel _musicModel = new MusicModel(
    title: '杏花弦外雨',
    author: 'qweqwe',
    url: 'https://gitee.com/kungfupan/vue-music/blob/master/static/music/critty.mp3',
    progress: 0,
    length: 130,
    playing: false,
    lyrics: [
      Lyric(activeTime: 0, content: '作曲 : 潇梦临'),
      Lyric(activeTime: 1, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 3, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 4, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 5, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 6, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 10, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 12, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 13, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 20, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 30, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 36, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 38, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 100, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 110, content: '作词 : 若紫鸢'),
      Lyric(activeTime: 120, content: '作词 : 若紫鸢'),
    ]
  );
  AnimationController _playController;
  @override
  void initState() {
    super.initState();
    double duration = (100 - _musicModel.progress)*_musicModel.length/100*1000;// 根据歌曲播放进度计算歌曲剩余时间
    _playController = new AnimationController(
      duration: Duration(milliseconds: duration.toInt()),
      upperBound: 100,
      value: _musicModel.progress.toDouble(),
      vsync: this
    );
    new CurvedAnimation(
      parent: _playController,
      curve: Curves.ease,
    )
    ..addListener(() {
      setState(() {
        _musicModel.progress = _playController.value.toInt();
      });
    })
    ..addStatusListener((status) {
      if(status == AnimationStatus.completed && _playController.value == 100){
        setState(() {
          _musicModel.playing = false;
        });
      }
    });
  }
  @override
  void dispose() {
    super.dispose();
    _playController.dispose();
  }
  @override
  Widget build(BuildContext context) {
    if(_musicModel.playing){
      _playController.forward(from: _playController.value);
    }
    else{
      _playController.stop();
    }
    return new Theme(
      data: ThemeData(
        iconTheme: IconThemeData(color: Colors.white),
        textTheme: TextTheme(
          body1: TextStyle(color: Colors.white)
        )
      ),
      child: new Scaffold(
        appBar: AppBar(
          backgroundColor: Color(0xff011634),
          title: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              new Text(_musicModel.title, style: TextStyle(fontSize: 18),),
              new Text(_musicModel.author, style: TextStyle(fontSize: 10, color: Colors.grey))
            ],
          ),
          leading: new IconButton(icon: Icon(Icons.arrow_back, color: Colors.white)),
          actions: <Widget>[
            new IconButton(icon: Icon(Icons.share, color: Colors.white))
          ],
        ),
        body: new Container(
          decoration: BoxDecoration(
            gradient: RadialGradient(
              radius: 0.8,
              colors: [Color(0xff4A6975), Color(0xff011634)],
            )
          ),
          padding: EdgeInsets.only(left: 16, right: 16, bottom: 16),
          child: Column(
            children: <Widget>[
              Expanded(
                child: Stack(
                  children: <Widget>[
                    Offstage(
                      offstage: _isAlbumShow == false,
                      child: Album(music: _musicModel, onClick: _changeStage,),
                    ),
                    Offstage(
                      offstage: _isAlbumShow == true,
                      child: Lyrics(music: _musicModel, onClick: _changeStage,),
                    )
                  ],
                ),
              ),
              PlayPanel(music: _musicModel, onPlayChange: _onPlayChange,)
            ],
          ),
        ),
      ),
    );
  }

  void _onPlayChange(type, val) {
    switch (type) {
      case MusicChangeType.progress:
        setState(() {
          _musicModel.progress = val;
        });
        break;
      case MusicChangeType.playing:
        setState(() {
          _musicModel.playing = val;
        });
        break;
      default:
    }
  }

  void _changeStage(val) {
    setState(() {
      _isAlbumShow = val;
    });
  }
}